<!DOCTYPE html>
<html>

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"
        integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <!-- <script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.1/js/bootstrap.min.js"
        integrity="sha512-UR25UO94eTnCVwjbXozyeVd6ZqpaAE9naiEUBK/A+QDbfSTQFhPGj5lOR6d8tsgbBk84Ggb5A3EkjsOgPRPcKA=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.18/dist/js/bootstrap-select.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/i18n/defaults-zh_CN.min.js"></script> -->


    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.1/css/bootstrap.min.css"
        integrity="sha512-T584yQ/tdRR5QwOpfvDfVQUidzfgc2339Lc8uBDtcp/wYu80d7jwBgAxbyMh0a9YM9F8N3tdErpFI8iaGx6x5g=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css"> -->
    <!-- <link rel="stylesheet"
        href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.18/dist/css/bootstrap-select.min.css"> -->
    <title>ChatCinema</title>
</head>

<body>
    <div style="text-align: center; ">
        <img src="/bird.ico" style="width:150px;margin-top:80px;">
    </div>

    <h1 style="margin: 10px 0px 0px 0px;text-align: center;">ChatCinema v1.0</h1>
    <h6 style="margin: 30px 0px 0px 0px;text-align: center">开发者：连环开鱼手海绵鲍勃</h6>
    <form class="login">
        <div class="mb-3 row">
            <div class="col-sm-12">
                <input type="text" class="form-control" id="username" name="Name" placeholder="用户名">
            </div>
        </div>
        <div class="mb-3 row">
            <div class="col-sm-12">
                <input type="text" class="form-control" id="password" name="password" placeholder="密码">
            </div>
        </div>
        <div class="d-grid gap-2">
            <button class="btn btn-primary" id="login_btn" style="width: 100%;">登录/注册</button>
        </div>
    </form>



    <script>
        $("#login_btn").on("click", function () {
            var us = $("#username").val();
            var pwd = $("#password").val();
            var mess = { 'username': us, 'password': pwd };
            $.ajax({
                type: "POST",
                url: "/login",
                data: JSON.stringify(mess),
                dataType: "json",
                success: function (data) {
                    console.log(data);
                    if (data.status == "1") {
                        alert("登录成功！");
                        location.href=("/videohtml");
                    }
                    else if(data.status == "0") {
                        alert("登录失败");
                    }
                },
                error: function (error) {
                    console.log(error);
                }
            });
            return false;
        });
    </script>

</body>


<style lang="css">
    .website-icon {
        font-size: 27px;
        margin: 35px 5px 12px 12px;
    }

    body {
        margin: 8px;
    }

    .content {
        position: absolute;
        left: 178px;
        top: 72px;
        right: 0;
        bottom: 0;
    }



    .login {
        padding-top: 60px;
        width: 385px;
        margin: auto;
    }

</style>

</html>